<template>
  <div>
    <div>
      <div v-for="val in values" :key="val.name">
        <van-divider v-if="val.type === 'divider'">{{ val.title }}</van-divider>
        <van-cell
          v-else-if="val.type === 'todo'"
          :title="val.title"
          :icon="val.icon"
          value="建设中..."
        />
        <van-cell
          v-else
          :title="val.title"
          :icon="val.icon"
          is-link
          :value="val.value && val.value()"
          :to="val.path"
        />
      </div>
    </div>
  </div>
</template>

<script>
import menus from './menus'

import api from '@/api'

import { searchToDomainList } from '@/api/utils'

export default {
  name: 'Menus',
  components: {},

  data() {
    return {
      menuItems: [],
      values: [],

      dataCounts: {}
    }
  },
  computed: {},
  async created() {
    await this.init()
  },

  methods: {
    async init() {
      //
      const { menu } = this.$route.query
      const { text, children } = menus[menu]

      this.$store.dispatch('header/setTitle', text)
      this.menuItems = children
      this.values = children.map(item => {
        return this.toCellValue(item)
      })

      const dcs = {}

      const menuItems = this.menuItems
      // console.log('menuItems, ', this.menuItems)

      for (let i = 0; i < menuItems.length; i++) {
        if (menuItems[i].model) {
          const Model = api.env(menuItems[i].model)
          // console.log('menuItem, ', menuItems[i].model, Model)

          const propForList = Model.metadata.propForList || {}

          const searchResult = Model.metadata.filter || []
          const searchs = propForList.searchs || {}
          const domain2 = searchToDomainList(searchResult, searchs)

          dcs[menuItems[i].model] = await this.$store.dispatch(
            'object/search_count',
            {
              _model: menuItems[i].model,
              domain2
            }
          )
        }
      }
      this.dataCounts = { ...dcs }
    },

    toCellValue(item) {
      return {
        path: {
          path: '/object/list',
          query: { model: item.model }
        },
        type: item.type,
        title: item.title,
        name: item.name,
        // icon: 'friends-o'
        value: () => {
          return this.dataCounts[item.model]
        }
      }
    }
  }
}
</script>

<style type="text/css"></style>
